<template>
  <div>
    <el-form ref="formRef" v-if="formModel" :model="formModel" label-width="120px" class="dialog-form" label-position="right" status-icon>
      <el-form-item label="车牌号:">
        <el-input disabled v-model.trim="formModel.carNumber" class="input-item" clearable></el-input>
      </el-form-item>
      <el-form-item label="车辆品牌:">
        <el-input disabled v-model.trim="formModel.carTypeBrance" class="input-item" clearable></el-input>
      </el-form-item>
      <el-form-item label="车辆型号:">
        <el-input disabled v-model.trim="formModel.carTypeTypeName" class="input-item" clearable></el-input>
      </el-form-item>
      <el-form-item label="车辆颜色:">
        <el-input disabled v-model.trim="formModel.color" class="input-item" clearable></el-input>
      </el-form-item>
      <el-form-item label="车辆密码:">
        <el-input disabled v-model.trim="formModel.carPassword" class="input-item" clearable></el-input>
      </el-form-item>
      <el-form-item label="SIM卡号:">
        <el-input disabled v-model.trim="formModel.phone" class="input-item" clearable />
      </el-form-item>
      <el-form-item label="设备编号:">
        <el-input disabled v-model.trim="formModel.cid" class="input-item" clearable />
      </el-form-item>
      <el-form-item label="最近上报时间:">
        <el-input disabled v-model.trim="formModel.reportTime" class="input-item" clearable></el-input>
      </el-form-item>
    </el-form>
    <div v-else>暂无绑定车辆</div>
  </div>
</template>

<script>
export default {
  props: {
    initData: {
      type: Object,
      default() {
        return {}
      }
    }
  },
  data() {
    return {
      formModel: null
    }
  },
  created() {
    this.fetchData()
  },
  methods: {
    /*
     * 查询表格列表数据
     */
    fetchData() {
      const { id } = this.initData
      this.isLoading = true
      this.$api.owner
        .fetch('queryCarListByPeople', {
          id
        })
        .then(res => {
          this.isLoading = false
          this.formModel = res ? res[0] : null
        })
    }
  }
}
</script>
